<template>
	<view class="topContains">
		 <u-sticky customNavHeight="0">
			<view class="d-flex align-center u-flex-wrap mx-3 pt-2">
			  <u-tag
				class="mr-2"
				size="mini"
				v-for="(item, index) in childList"
				:key="index"
				:text="item.chilName"
				plainFill
				:bgColor="item.chilNal == chilNalOne ? '#e6f7ff' : '#FFF'"
				:color="item.chilNal == chilNalOne ? '#069AFA' : '#000'"
				:borderColor="item.chilNal == chilNalOne ? '#069AFA' : '#FFF'"
				:name="index"
				@click="radioClick(item)"
			  >
			  </u-tag>
			</view>
		</u-sticky>
		<!-- 订单 -->
		<view class="mt-16">
		  <u-empty mode="order" text="暂无今日待办订单,快去接单吧" textSize="12" textColor="#999">
		  </u-empty>
		  <view class="colorb2 font-12 mt-4 px-4 text-center">
		   <u-button
		    @click="toIndex"
		     class="custom-style"
		     type="primary"
		     :plain="true"
		     :hairline="true"
		     text="去接单"
		   ></u-button>
		  </view>
		</view>
		
	</view>
</template>

<script>
	export default {
	  data() {
	    return {
			 chilNalOne: 0,
			 childList:[
				  {
						chilName:"待预约",
						chilNal:0,
				  }, {
						chilName:"待上门",
						chilNal:1,
				  },
				  {
						chilName:"待完成",
						chilNal:2,
				  },
			 ]
	    };
	  },
	  methods: {
		  radioClick(item) {
		    this.chilNalOne = item.chilNal;
		  },
		  toIndex(){
			  uni.navigateBack()
		  },
	  }
	};
</script>

<style lang="scss" scoped>
	.custom-style {
	  color: $u-primary;
	  width: 260rpx;
	  border-radius: 12rpx;
	}
</style>